<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
		<style>
			*{margin: 0;padding: 0;list-style: none;text-decoration: none;font-family: '幼圆';color:#323232;}
			html{font-size: calc(100/750*100vw);}
			a {
  					-webkit-tap-highlight-color: transparent;
 					 -webkit-touch-callout: none;
  					-webkit-user-select: none;}
 			h1,h2,h3,h4,h5,h6{font-size: 100%;font-weight:200;}	
 			body{background: #F0F0F0;}		
 			section{margin-top: 1.26rem;}
 			ul{background: #F0F0F0;position: relative;}
 			ul li{background: #FAFAFA;min-height: 2.8rem;position: relative;overflow: hidden;margin-bottom: .2rem;}
 			ul li .img1{width: .6rem;float:left;margin-top: .2rem;margin-left: .2rem;}
 			ul li h1{font-size: .24rem;line-height:.24rem;float:left;margin-top: .2rem;margin-left: .4rem;display: inline-block;}
 			ul li h2{font-size: .22rem;line-height:.24rem;color: #646464;float:left;margin-top: .2rem;margin-left: .2rem;}
 			ul li p{font-size: .24rem;width: 7.1rem;float: left;margin-left: .2rem;margin-top:.1rem;line-height: .34rem;}
 			ul li .img2{width: 3rem;float: left;margin-left: 3.5rem;margin-top: .3rem;}
 			ul li .img3{width: .6rem;float:right;margin-top: .25rem;margin-right:.2rem ;}
		</style>
	</head>
	<body>
		<section>
			<ul>
				<li>
					<img class="img1" src="img/four/lesson-info2.png" />
					<h1>张妈妈</h1>
					<h2>来自话题:孕期</h2>
					<p>崔老师，最近每天都要做多重任务，每个任务都很重要，感觉身体不适，应当怎样缓解？</p>
					<img class="img2" src="img/four/four-myask.png" />
					<img class="img3" src="img/third/third-content3.png" />
					<audio id='voice' src="video/voice.mp3"  loop="loop"></audio>
				</li>
				<li>
					<img class="img1" src="img/four/lesson-info2.png" />
					<h1>张妈妈</h1>
					<h2>来自话题:孕期</h2>
					<p>崔老师，最近每天都要做多重任务，每个任务都很重要，感觉身体不适，应当怎样缓解？</p>
					<img class="img2" src="img/four/four-myask.png" />
					<img class="img3" src="img/third/third-content3.png" />
				</li>
			</ul>
		</section>
		<script type="text/javascript" src="js/jquery.js" ></script>
		<script>
			$('.img2').click(function(){
		if($('#voice')[0].paused){
			$('#voice')[0].play();
			return;
			}
		else if($('#voice')[0].play){
			$('#voice')[0].pause();
			return;
		}
		})
		</script>
	</body>
</html>

